/*
 * @Author: 高瑞寒 15932717091@163.com
 * @Date: 2022-04-30 20:50:49
 * @LastEditTime: 2022-05-01 12:01:22
 * @LastEditors: 高瑞寒 15932717091@163.com
 * @Description: 
 */
import React, { Component } from 'react'
import store from '../../store/redux'
import {increase,reduction} from '../../store/action'
export default class Count extends Component {
  state = {
    num: 0
  }
  handleChange = (e) => {
    console.log(e);
  }
  computed = (type) => {
    if (type === '+') {
      store.dispatch(increase(this.selectRef.value))
    } else {
      store.dispatch(reduction(this.selectRef.value))

    }
  }
  oddNumberAdd = () => {
    if (this.state.num % 2 !== 0) this.setState({ num: this.state.num + this.selectRef.value * 1 })
  }
  asyncAdd = () => {
    setTimeout(() => this.setState({ num: this.state.num + this.selectRef.value * 1 }), 1000)
  }
  render() {
    return (
      <div>
        <h3>当前值:{store.getState()}</h3>
        <select ref={e => this.selectRef = e} onChange={e => this.handleChange(e)}>
          <option value={1}>1</option>
          <option value={2}>2</option>
          <option value={3}>3</option>
        </select>
        <button onClick={e => this.computed(e.target.innerHTML)}>+</button>
        <button onClick={e => this.computed(e.target.innerHTML)}>-</button>
        <button onClick={this.oddNumberAdd}>奇数加</button>
        <button onClick={this.asyncAdd}>异步加</button>
      </div>
    )
  }
}
